.body-data {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    .panel {
        width: 40%;
        height: 70%;
        border-radius: 20px;
        position: absolute;
        z-index: 4;
        background-color: #2c3e50;
        display: none;
        transition: all 0.3s ease;
        .panel_cancel {
            left: 90%;
            position: relative;
            z-index: 3;
            left: 84%;
            top: 4%;
            background-color: #3498db;
            font-size: 0.8em;
            height: 6%;
            width: 9%;
            border-radius: 6px;
            border: 1px solid #93c5fb;
            color: #fffffe;
            display: flex;
            justify-content: center;
            transition: all 0.3s ease;
            align-items: center;
            cursor: pointer;
            &:hover {
                color: #f1f3f5;
                background-color: #81aaec;
            }
        }
        .all_form {
            margin-top: 5%;
            height: 45vh;
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            align-items: center;
            position: relative;

            input {
                outline: none;
                display: block;
                border-radius: 10px;
                height: 7%;
                width: 50%;
                padding-top: 3px;
                padding-bottom: 3px;
                font-size: 0.8em;
                &:focus {
                    outline: none;
                    display: block;
                    border-radius: 10px;
                    border: #005a9e94 solid 3px;
                }
            }
        }
        .all_button {
            margin-top: 3%;
            display: flex;
            flex-direction: row;
            justify-content: center;
            height: 10vh;
            button {
                width: 16%;
                height: 50%;
                cursor: pointer;
                color: #f5f6fa;
                border: none;
                border-radius: 10px;
                transition: all 0.5s ease;
            }
            .panel_reset {
                margin-right: 10%;
                background-color: #f9ca24;
                &:hover {
                    background-color: #efc52bdc;
                }
            }
            .panel_submit {
                background-color: #0078d4;
                &:hover {
                    background-color: #0078d4d3;
                }
            }
        }
    }
    .panel_modify {
        width: 40%;
        height: 70%;
        border-radius: 20px;
        position: absolute;
        z-index: 4;
        background-color: #2c3e50;
        transition: all 0.3s ease;
        .panel_cancel_modify {
            left: 90%;
            position: relative;
            z-index: 3;
            left: 84%;
            top: 4%;
            background-color: #3498db;
            font-size: 0.8em;
            height: 6%;
            width: 9%;
            border-radius: 6px;
            border: 1px solid #93c5fb;
            color: #fffffe;
            display: flex;
            justify-content: center;
            transition: all 0.3s ease;
            align-items: center;
            cursor: pointer;
            &:hover {
                color: #f1f3f5;
                background-color: #81aaec;
            }
        }
        .all_form_modify {
            margin-top: 5%;
            height: 45vh;
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            align-items: center;
            position: relative;

            input {
                outline: none;
                display: block;
                border-radius: 10px;
                height: 7%;
                width: 50%;
                padding-top: 3px;
                padding-bottom: 3px;
                font-size: 0.8em;
                &:focus {
                    outline: none;
                    display: block;
                    border-radius: 10px;
                    border: #005a9e94 solid 3px;
                }
            }
        }
        .all_button_modify {
            margin-top: 3%;
            display: flex;
            flex-direction: row;
            justify-content: center;
            height: 10vh;
            button {
                width: 16%;
                height: 50%;
                cursor: pointer;
                color: #f5f6fa;
                border: none;
                border-radius: 10px;
                transition: all 0.5s ease;
            }
            .panel_reset_modify {
                margin-right: 10%;
                background-color: #f9ca24;
                &:hover {
                    background-color: #efc52bdc;
                }
            }
            .panel_submit_modify {
                background-color: #0078d4;
                &:hover {
                    background-color: #0078d4d3;
                }
            }
        }
    }
    .panel_show {
        display: block;
    }
    #window_table {
        position: relative;
        box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.3);
        border-radius: 10px;
        color: #8a8886;
        width: 95%;
        height: 85%;
        overflow-y: scroll;
        &::-webkit-scrollbar {
            /*滚动条整体样式*/
            width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
            height: 2px;
        }
        &::-webkit-scrollbar-thumb {
            /*滚动条里面小方块*/
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            background: #535353;
        }
        &::-webkit-scrollbar-track {
            /*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
            border-radius: 10px;
            background: #ededed;
        }
        .add_data_button {
            position: absolute;
            z-index: 3;
            left: 90%;
            top: 5%;
            background-color: #3498db;
            font-size: 0.8em;
            height: 5%;
            width: 4%;
            border-radius: 6px;
            border: 1px solid #93c5fb;
            color: #fffffe;
            display: flex;
            justify-content: center;
            transition: all 0.3s ease;
            align-items: center;
            cursor: pointer;
            &:hover {
                color: #f1f3f5;
                background-color: #81aaec;
            }
        }
        table {
            margin: 0 auto;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            margin-top: 3%;
            width: 90%;
            border-collapse: collapse;
            border: none;
            text-align: center;
            caption {
                font-size: 24px;
                transform: translateY(-10px);
            }
            thead {
                tr {
                    background-color: #005a9e;
                    height: 30px;
                    color: #e6e5e4;
                    td {
                        border: none;
                        font-family: '宋体';
                    }
                }
            }
            tbody {
                tr {
                    border: none;
                    color: #3b3a39;
                    td {
                        font-family: '宋体';
                        border: none;
                        border-bottom: #727272 solid 1px;
                        height: 25px;
                        &:nth-last-child(1),
                        &:nth-last-child(2) {
                            font-family: '微软雅黑';
                            &:hover {
                                background-color: #0078d4;
                                color: #3b3a39;
                                font-weight: 700;
                            }
                            a {
                                color: #3b3a39;
                                height: 100%;
                                width: 100%;
                            }
                        }
                    }
                    &:nth-child(odd) {
                        background-color: #c7e0f4;
                    }
                    &:nth-child(even) {
                        background-color: #fff;
                    }
                    &:hover {
                        background-color: #71afe5;
                        cursor: pointer;
                    }
                    transition: all 0.2s ease;
                }
            }
        }
    }
}
